/************************************************************
uso:
<div class="boton-azul-normal"><a class="boton-texto-blanco" href="#">Guardar</a></div><br />
<div class="boton-azul-mediano"><a class="boton-texto-blanco" href="#">Crear Nueva Categoria</a></div><br />
<div class="boton-gris-normal"><a class="boton-texto-negro" href="#">Guardar</a></div><br />
<div class="boton-gris-mediano"><a class="boton-texto-negro" href="#">Crear Nueva Categoria</a></div><br />
************************************************************/
.cursorPointer {cursor:pointer;}
.boton-gris-x {
  border:solid 1px #999;
  background-color: #e0e0e0;
  font-family:Arial;
  font-size: 11px;
  font-weight:bold;
  color: #666;
  cursor: pointer;
}
.boton-verde, .boton-azul, .boton-gris {
  font-family:Arial;
  font-size:12px;
  font-weight:bold;
  text-align: center;
  padding-top:7px;
  padding-bottom:7px;
  padding-left:20px;
  padding-right:20px;
  cursor:pointer;
}
.boton-verde {
  color:#fff;
  background-color:#6CA851;
  border:solid 1px #3B6E22;
}
.boton-verde:hover {
  background-color:#3B6E22;
  border:solid 1px #3B6E22;
}
.boton-azul {
  color:#fff;
  background-color:#4C8FFC;
  border:solid 1px #3079ED;
}
.boton-azul:hover {
  background-color:#367BE9;
  border:solid 1px #2F5BB7;
}
.boton-gris {
  color:#333;
  background-color:#F5F6F6;
  border:solid 1px #999;
}
.boton-gris:hover {
  background-color:#E4E5E5;
  border:solid 1px #999;
}

.boton-menu {width:27px; height:84px; vertical-align:middle;}
.boton-texto-negro
{
  font-family:Arial;
  font-size: 11px;
  font-weight:bold;
  text-decoration: none;
  color: #333;
}

.boton-texto-blanco
{
  font-family:Arial;
  font-size: 11px;
  font-weight:bold;
  text-decoration: none;
  color: #fff;
}

.boton-azul-normal, .boton-gris-normal, .boton-rojo-normal, .boton-verde-normal
{
  background-color: transparent;
  background-image: url(img/spriteBotones.png);
  background-repeat: no-repeat;
  width: 84px;
  height: 25px;
  padding-top:8px;
  text-align:center;
  display:inline-block;
}

.boton-azul-mediano, .boton-gris-mediano, .boton-rojo-mediano, .boton-verde-mediano, .boton-menu-activo, .boton-menu-inactivo
{
  background-color: transparent;
  background-image: url(img/spriteBotones.png);
  background-repeat: no-repeat;
  width: 137px;
  height: 25px;
  padding-top:8px;
  text-align:center;
  display:inline-block;
}


/* obtiene la imagen del sprite */
.boton-azul-normal {background-position:0px 0px;}
.boton-azul-normal:hover {background-position:0px -66px;}
.boton-azul-normal a {text-decoration: none; color: #fff;}
.boton-azul-normal:hover a {text-decoration: none; color: #333;}
.boton-azul-normal span {text-decoration: none; color: #fff;}
.boton-azul-normal:hover span {text-decoration: none; color: #333;}
.boton-azul-mediano {background-position:-85px 0px;}
.boton-azul-mediano:hover {background-position:-85px -66px;}
.boton-azul-mediano a {text-decoration: none; color: #fff;}
.boton-azul-mediano:hover a {text-decoration: none; color: #333;}
.boton-azul-mediano span {text-decoration: none; color: #fff;}
.boton-azul-mediano:hover span {text-decoration: none; color: #333;}

.boton-gris-normal {background-position:0px -33px;}
.boton-gris-normal:hover {background-position:0px -66px;}
.boton-gris-normal a {text-decoration: none;}
.boton-gris-normal:hover a {text-decoration: none;}
.boton-gris-mediano {background-position:-85px -33px;}
.boton-gris-mediano:hover {background-position:-85px -66px;}
.boton-gris-mediano a {text-decoration: none;}
.boton-gris-mediano:hover a {text-decoration: none;}

.boton-rojo-normal {background-position:0px -132px;}
.boton-rojo-normal:hover {background-position:0px -165px;}
.boton-rojo-normal a {text-decoration: none; color: #fff;}
.boton-rojo-normal:hover a {text-decoration: none;}
.boton-rojo-mediano {background-position:-85px -132px;}
.boton-rojo-mediano:hover {background-position:-85px -165px;}
.boton-rojo-mediano a {text-decoration: none; color: #fff;}
.boton-rojo-mediano:hover a {text-decoration: none;}

.boton-verde-normal {background-position:0px -99px;}
.boton-verde-normal:hover {background-position:0px -33px;}
.boton-verde-normal a {text-decoration: none; color: #fff;}
.boton-verde-normal:hover a {text-decoration: none; color: #333;}
.boton-verde-mediano {background-position:-85px -99px;}
.boton-verde-mediano:hover {background-position:-85px -33px;}
.boton-verde-mediano a {text-decoration: none; color: #fff;}
.boton-verde-mediano:hover a {text-decoration: none; color: #333;}

.boton-menu-activo {background-position:-28px -198px; width:27px; height:84px; cursor:pointer;}
.boton-menu-inactivo {background-position:0px -198px; width:27px; height:84px; cursor:pointer;}
